<!DOCTYPE html>
<html lang="zh-CN" ng-app="share">

	<head>
		<meta charset='utf-8' />
		
		<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
		<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
		<script src="/static/js/my.js"></script>
		<bootstrap></bootstrap>
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<script type="text/javascript">
		app.run(function ($rootScope) {
			$rootScope.color='blue';
			$rootScope.isred = true;
			
		})

		app.controller('navi',function ($scope) {
			
			$scope.say =function (name) {
        		alert('ok'+name);
        	};
        	$scope.name='dddddog';
			//$scope.items={{ items|safe }};
			$scope.items=[
            {name:'heyulin',
             link:$scope.say},
            {name:'zhangrong',
             link: $scope.say}
        ]	
		});
		app.controller('content',function ($scope,$http,$compile) {
			$scope.view = 'record';
			$scope.heads=['姓名','生日'];
			$scope.items=[
			       ['何逸柔','2012/06/22',],
			       ['何景雯','2014/04/27']
			];
			$scope.form_items=[
				{name:'hername',type:'text',label:'hername'},
				{name:'heremal',type:'email',label:'her email'},
				{name:'hernote',type:'radio',label:'her notes'}
			]
			$scope.btn_new = function () {
				$scope.view='edit';
			};
			$scope.btn_save=function () {
				//$scope.jj={name:'fff'};
				//alert('name' in $scope.jj);
				$scope.view='record';
			};
			$scope.submit_ajax=function () {
				var postData = {
					operation:'save',
					name:'heyulin',
					birthday:'1981-10-23'
				};  
				//下面这一行会被当成参数附加到URL后面，所以post请求最终会变成/api/user?id=5  
				var config = {params: {id: '5'}}; 
				$http.post('/share/test/postjson', postData, config  
				).success(function(data, status, headers, config) {  
				    //成功之后做一些事情  
				    alert('ok');
				    $scope.view='record';
				}).error(function(data, status, headers, config) {  
				    //处理错误  
				    alert('erro');
				    alert(data);
				});  
			};
			$scope.get_ajax=function () {
				
				$http.get('/share/test/getjson')
				.success(function(data, status, headers, config) {  
				    //加载成功之后做一些事  
				    $scope.view='record';
				    $scope.items=data;
				    $scope.hh ='hello';
				}).error(function(data, status, headers, config) {  
				    //处理错误  
				});  
			};
			$scope.dog='dog';
			$scope.add_dom=function () {
				//var ele = $compile('<div>ri [[dog]] ri</div>')($scope)
				$('#test11').html('<div>ri [[dog]] ri</div>');
				$compile($('#test11').html())($scope);
				$scope.dog='pig'
			};
			$scope.change_dog= function () {
				
				$scope.dog = 'chicken';
			}
		})
		</script>
		<style type="text/css" media="screen" id="test">
			.red{
				color: [[color]];
			}
			.linespace{
				padding-top:30px;
			}
			
		</style>
		<script type="text/javascript">
			//$(function(){
			//	$('#test11').html('<div hello>riri</div>');
			//	});
		</script>
		</head>
	<body>
<div class="row" style="color:white;background-color: blue;height:20px; text-align: center;margin-bottom:10px;">
		this is head
</div>
<div class="container">
	
<div class="row">
	<div class="col-md-3" ng-controller='navi'>
		<div left-navi items='items' ></div>
		<div id='test11'></div>
		<div hello aa="items"></div>
	</div>

	<div class='col-md-9' ng-controller='content' ng-switch='view'>
		<div ng-switch-when='record'>
			<div><button name="new" type="button" value="val" ng-click='btn_new()'>新增</button></div>
			<div big-table heads='heads' items='items'></div>
		</div>
		<div ng-switch-when='edit'>
			<div myform items='form_items'>这里是编辑界面</div>
			<div><button name="save" type="button" value="val" ng-click='btn_save()'>保存</button></div>
			<div><button name='ajax' type='button' value='btn_ajax' ng-click='change_dog()'>提交ajax</button></div>
			<div><button name='get_ajax' type='button' value='btn_get_ajax' ng-click='add_dom()'>获取ajax</button></div>
		</div>
	</div>


	
</div>
</div>
	
	</body>
</html>